*{
    margin: 0;
    padding: 0;
}

/* 最外层容器 */
.container{
    width: 1000px;
    height: 700px;
    margin: 10px auto;
    display: flex;
}

/* 左边 */
.left-wrapper{
    width: 350px;
}

/* 右边 */
.right-wrapper{
    width: 650px;
}

/* 阵型控制区域 */
.left-control{
    width: 350px;
    height: 300px;
    background: url(../images/bg.gif) no-repeat center;
    position: relative;
    cursor: pointer;
}


.left-control img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.left-control img.control-show-img{
    opacity: 0;
}

/* 玩法说明区域 */
.left-info p{
    width: 350px;
    text-align: center;
    margin: 20px 0;
}


/* 右侧区域 */
.right-wrapper{
    display: grid;
    /* grid-template: repeat(20, 35px)/repeat(5, 130px); */
    grid-template-rows: repeat(20, 35px);
    grid-template-columns: repeat(5, 130px);
    grid-auto-flow: column;
    text-align: center;
}

.right-wrapper .value > img{
    width: 30px;
    height: 30px;
    vertical-align: middle;
}

.right-wrapper .number{
    margin-right: 6px;
}